<template>
	<h3>MyLeft组件</h3>
	<h2>引入public目录的图片</h2>
	num:{{num}}
	<button @click="add">点击add</button>
	<img src="/1.png" alt="" class="img-thumbnail" />
</template>

<script setup>
import { onActivated, onDeactivated, onMounted, onUnmounted, ref } from 'vue';
	const num=ref(1)
	const add=()=>{
		num.value++
	}
	//生命周期
	onMounted(()=>{
		console.log('MyLeft组件被挂载了')
	})
	
	onUnmounted(()=>{
		console.log('MyLeft组件被销毁了')
	})
	
	onActivated(()=>{
		console.log('MyLeft组件被激活了')
	})
	onDeactivated(()=>{
		console.log('MyLeft组件被缓存了')
	})
</script>

<style scoped>
</style>